//变量
@white:#fff;
/* 首页-组件化设计 */
// 第一天内容 头部
// header{
//     width: 100%;
//     height: 66px;
//     border-bottom:1px solid #aec7ec;
//     z-index: 999;
//     box-sizing: border-box;
//     .logo{
//         width: 230px;
//         height: 30px;
//     }
//     .menu{
//         left:50%;
//         transform: translate(-50%);
//         // line-height: 66px;
//         top: 20px;
//         li{
//             float: left;
//             margin: 0 20px;
//             a{
//                 color:@white;
//             }
//             &.active{
//                 border-bottom: 2px solid @white;
//             }
//         }
//     }
//     .right{
//         a{
//             display: inline-block;
//             border:1px solid @white;
//             border-radius: 16px;
//             color:@white;
//             &:last-child{
//                 background-color: #ed510a;
//                 border:1px solid #ed510a;
//             }
//         }
//     }
// }

// banner
.banner{
    width: 100%;
    height: 680px;
    overflow: hidden;
    .bg01{
        background: url(../images/banner1.png) no-repeat center;
    }
    .bg02{
        background: url(../images/banner2.png) no-repeat center;
    }
    .bg03{
        background: url(../images/banner3.png) no-repeat center;
    }
}



// 第二天内容
// 云服务
#service{
    ul{
        width: 1120px;
        li{
            width: 240px;
            float: left;
            height: 280px;
            margin: 0 20px;
            box-shadow: 4px 3px 15px rgba(0, 91, 224, 0.5);
            img{
                width: 240px;
                height: 170px;
            }
        }
    }
}

  // API部分
#apiCate{
    width: 100%;
    padding-top: 1px;
    padding-bottom: 66px;
    background: #f8f9fb url(../images/more-api-bg.svg);
    ul{
        li{
            width: 224px;
            height: 140px;
            float: left;
            background-color: #fff;
            margin: 0px 20px 20px 0;
            box-shadow: 4px 3px 15px rgba(0, 91, 224, 0.5);
            &:nth-child(5n){
                margin-right: 0;
            }
        }
    }
   }

//  API智能接入
#apiSmart{
        li{
            width: 400px;
            height: 70px;
            background-color: #fbfbfb;


        }
}

// 独角兽
#unicorn{
 .content{
    margin-top: 50px;
    height: 270px;
    background-color: #f8f9fb;
    
    .items{
        display: none;
        .left-img{
            width: 580px;
            height: 290px;
            top: -20px;
        }
        .right-box{
            width: 580px;
            p{
                line-height: 25px;
                margin-top: 27px;
            }
          .more{
            right: 0px;
            bottom: 30px;
            &:after{
                content: '';
                display: block;
                width: 12px;
                height: 4px;
                background-color: #1271ef;
                position: absolute;
                top: 10px;
                left: -20px;
            }
          }
        }
    }
 }
}




// 数据安全和可靠合规的服务
#serveDate{  
       text-align: center;
        li{
            width: 200px;
            div{
                width: 160px;
                height: 90px;
            }
            // img{
            //     width: 200px;
            // }
        }
    }




/* 免费 */
.experience-Now{
    background: url(../images/login-register-bg.svg) #1271ef;
    padding: 65px 0;
  }
  .experience-Now div{
    text-align: center;
    color: #fff;
  }
  .experience-Now div h1{
    font-size: 40px;
  }
  .experience-Now div a{
    color: #fff;
    border: 1px solid #fff;
    padding: 10px 25px;
    display: inline-block;
    margin-top: 25px;
    font-size: 14px;
  }
  
  
  /* 公共尾部 */
  /* 尾部 */
//   .footer{
//     text-align: left;
//     margin-top: 40px;
//     float: left;
//   }
//   .footer tr{
//    padding-bottom: 35px;  
//   }
//   .footer tr th{
//     font-size: 16px;
//     padding-bottom: 35px ;
//     margin-right: 60px;
//   }
//   .footer tr th a{
//     color: #000;
//   }
//   .footer tr a{
//     display: inline-block;
//     padding-bottom:18px ;
//     color: #ccc;
//     margin-right: 60px;
//   }
//   /* 尾部二维码 */
//   .official-account{
//     float: right;
//     text-align: right;
//     width: 200px;
//   }
//   .official-account h3{
//     margin-top: 45px;
//   }
//   .official-account p{
    
//     padding-top: 20px;
//     padding-bottom: 35px;
//     color: #ccc;
//   }
//   /* 尾部指南 */
//   .tail-guide p{
//     display: inline-block;
//     padding-bottom: 25px;
//   }
//   .tail-guide{
//     padding-top: 30px;
//     padding-bottom: 20px;
//   }
//   .tail-guide .tail-left{
//     float: left;
//   }
//   .tail-guide .tail-rigth{
//     float:right;
//   }
  

footer{
    height: 100%;
}